.theInfo{
    color: var(--blueColor);
}
@media screen and (min-width: 900px) {
    .roomDetail {
        height: 30%;
        width: 100%;
        float: left;
        border: 1px #eee solid;
        --h1TextColor: #000;
    }

    .roomDetail img {
        height: 100%;
        padding: 5px;
        float: left;
    }

    .roomDetailText {
        width: 60%;
        height: 100%;
        margin-left: 20px;
        float: left;
    }

    .roomDetailText p{
        text-align: left;
        margin: 0px;
    }
}
@media screen and (max-width: 900px){
    .roomDetail {
        height: 18%;
        width: 100%;
        float: left;
        --h1TextColor: #000;
        border: 1px #eee solid;
    }
    .roomDetail img {
        height: 100%;
        width: 40%;
        padding: 5px;
        float: left;
    }
    .roomDetailText{
        float: left;
        width: 60%;
        height: 100%;
    }
    .roomDetailText p{
        text-align: left;
        margin: 0px;
    }
}
.roomLike{
    color: var(--orangeColor);
}


.roomDetailLike{
    width: 100%;
    height: 100px;
    border: 1px #eee solid;
    margin-top: 10px;
}
.roomDetailLike img{
    height: 100%;
    width: 40%;
    padding: 5px;
    float: left;
}
.rootDetailLikeText{
    float: left;
    width: 60%;
    height: 100%;
}

.rootDetailLikeText p{
    text-align: left;
    margin: 0px;
}


